* { margin: 0; padding: 0; font-style: normal; }
ul, li  { list-style: none; }
body { font-family: "PingFang SC","Helvetica Neue","Helvetica", "Microsoft Yahei", "Arial",sans-serif; font-size: 14px; color: #333; }
h2 { font-weight: normal; }

body {width: 100%; background-size: cover; background-color: #313131; }
#calendar {
	position: relative;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Chrome/Safari/Opera */
  -khtml-user-select: none; /* Konqueror */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently*/
	background-color: #fff;
	border-radius: 5px;
}
#calendar .header {
  position: absolute;
	top:0;
	left:0;
  width: 0;
	height:0;
  border-bottom: 1px solid #b4b2b3;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
#calendar .header ul {
  position: absolute;
  left: 0;
  top: 0;
	width:0;
	height:0;
  overflow: hidden;
  border-radius: 3px;
  font-size: 0;
}
#calendar .header ul li {
  display: inline-block;
  width: 0;
  height: 0;
  line-height: 0;
  font-size: 0.14rem;
  text-align: center;
  background-color: #fff;
  cursor: default;
}
#calendar .header ul li.cur {
  color: #fff;
  background-color: #6f6e6f;
}
#calendar .container {
  position: relative;
  width: 100%;
}
#calendar .container .render {
  display: none;
}
#calendar .container .render-show {
  display: block;
	padding-top:0.92rem;
	position: relative;
}
#renderMonth {
  padding-top: 5px;
	position: relative;
}
#renderMonth #control {
  font-size: 0.22rem;
	position: absolute;
	top:0;
	left:0;
	right:0;
	height:0.92rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color:#7c8791;
}
#control .title{
	margin:0 0.5rem;
	font-size:0.3rem;
	color:#4e5458;
}
#control input {
  text-align: center;
  font-size: 0.14rem;
  background: #fff;
  vertical-align: top;
  outline: none;
	color:#3b5fff;
}
#control .btn {
  width: 0.21rem;
	color:#b9c0c6;
	cursor: pointer;
}
#control .today {
  width: 0.96rem;
	height:0.4rem;
	margin-left:0.4rem;
	font-size:0.16rem;
	border: 1px solid #3b5fff;
	border-radius: 5px;
	cursor: pointer;
	display: none;
}
#renderMonth .week {
	color:#7c8791;
	display: flex;
	justify-content: space-between;
  font-size: 0;
	border-top: 1px solid #e6e5e6;
	padding:0.2rem 0.1rem;
}
#renderMonth .week li {
	width:14.285%;
  position: relative;
  font-size: 0.16rem;	
	text-align: center;
}
#renderMonth .day {
  display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	color:#7c8791;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	padding:0 0.1rem 0.3rem;
}
#renderMonth .day li {
	width:14.285%;
	height:0.7rem;
  font-size: 0;
  color: #ccc;
  background-color: #fff;
	overflow: hidden;
	text-align: center;
	margin:0.1rem 0;
}
#renderMonth .day li .showAllList{
	position: absolute;
	top:115%;
	right:0;
	width:100%;
	padding:0.2rem;
	background:#FFFFFF;
	border-radius: 5px;
	z-index:3;
	display: none;
}
#renderMonth .day li .showAllList.show{
	display: block;
}
#renderMonth .day li.cur-month {
  	color:#7c8791;
}
#renderMonth .day li p {
	font-size: 0.3rem;
}
#renderMonth .day li .info{
	margin-bottom:0.05rem;
}
#renderMonth .day li .lunar {
  float: left;
}
#renderMonth .day li .first-lunarday {
  position: relative;
  left: -5px;
  border-bottom: 1px solid #ff6d6d;
}
#renderMonth .day li .first-lunarJanuary {
  position: relative;
  left: -5px;
  border-bottom: 2px solid #ff6d6d; 
}
#renderMonth .day li .info .date{
	display: inline-block;
	width:26px;
	height:26px;
	line-height: 26px;
	border-radius: 100%; 
	border:1px solid transparent;
}
#renderMonth .day li.cur-day .info .date{
	background:-webkit-linear-gradient(to bottom, #476eff 0%, #3152ff 100%); 
	background:linear-gradient(to bottom, #476eff 0%, #3152ff 100%);
	color:#FFFFFF;
}
#renderMonth .day li.selected .info span{
	border:1px solid #3152ff;
	border-radius: 100%;
}

#renderMonth .day li .festival,
#renderMonth .day li .term,
#renderMonth .day li .customer{
	display: none;
	width:6px;
	height:6px;
	border-radius: 100%;
	background:-webkit-linear-gradient(to right, #eb663a 0%, #ee9226 100%); 
	background:linear-gradient(to right, #eb663a 0%, #ee9226 100%);
	color:transparent;
	margin:0 1px;
}
#renderMonth .day li .festival {
  background:-webkit-linear-gradient(to right, #eb663a 0%, #ee9226 100%); 
  background:linear-gradient(to right, #eb663a 0%, #ee9226 100%);
}
#renderMonth .day li .term {
  background:-webkit-linear-gradient(to right, #56e1c6 0%, #4ab7e8 100%); 
  background:linear-gradient(to right, #56e1c6 0%, #4ab7e8 100%);
}
#renderMonth .day li .customer {
  background:-webkit-linear-gradient(to right, #8f32ff 0%, #668bfe 100%); 
  background:linear-gradient(to right, #8f32ff 0%, #668bfe 100%);
}
#renderMonth .day li .festival.show,
#renderMonth .day li .term.show,
#renderMonth .day li .customer.show{
  display: inline-block;
	vertical-align: middle;
}
#renderFullYear {
  padding-top: 5px;
}
#renderFullYear > .title {
  width: 6.17rem;
  height: 0.42rem;
  padding: 0 0 10px 16px;
}
#renderFullYear > .title h2 {
  display: inline-block;
  line-height: 0.42rem;
  font-size: 0.3rem;
}
#renderFullYear > .title p {
  float: right;
  margin-top: 0.1rem;
  margin-right: 0.15rem;
}
#renderFullYear > .title .lunar-year {}
#renderFullYear > .title .lunar-year i {
  display: inline-block;
  margin: 0.9rem 0.06rem 0 0;
  width: 0.16rem;
  height: 3px;
  background-color: #FF6D6D;
  vertical-align: top;
}
#renderFullYear > .title .info {}
#renderFullYear > .title .info i {
  display: inline-block;
  width: 0.14rem;
  height: 1px;
  margin-top: -3px;
  margin-right: 5px;
  background-color: #ff6d6d;
  vertical-align: middle;
}
#renderFullYear .month {
  font-size: 0;
}
#renderFullYear .month .item {
  display: inline-block;
  width: 25%;
  padding: 0 0.1rem;
  box-sizing: border-box;
}
#renderFullYear .month .title {
  padding-left: 0.08rem;
  font-size: 0.18rem;
  color: #ff6d6d;
}
#renderFullYear .month .week {
  font-size: 0;
  text-align: center;
}
#renderFullYear .month .week li {
  display: inline-block;
  width: 0.22rem;
  height: 0.2rem;
  line-height: 0.2rem;
  font-size: 0.12rem;
  color: #ccc;
}
#renderFullYear .month .day {
  text-align: center;
  font-size: 0;
}
#renderFullYear .month .day li {
  display: inline-block;
  width: 0.18rem;
  height: 0.18rem;
  line-height: 0.18rem;
  margin: 2px;
  text-align: center;
  color: #ccc;
  font-size: 0.12rem;
  cursor: default;
}
#renderFullYear .month .day li.lunar-first {
  border-bottom: 1px solid #ff6d6d;
}
#renderFullYear .month .day li.lunar-january {
  border-bottom: 2px solid #ff6d6d;
}
#renderFullYear .month .day li.cur-month {
  color: #333;
}
#renderFullYear .month .day li.cur-day {
  color: #fff;
  background-color: #ff6d6d;
  border-radius: 50%;
}

/* 弹出框 */
#popup {
  display: none;
  position: absolute;
  width: 2.6rem;
  height: 1.04rem;
  background-color: #f8f8f8;
  box-shadow: 0 0 2px rgba(0, 0, 0, .3);
  border-radius: 6px;
	color:#b9c0c6;
}
#popup .title {
  padding: 0.1rem 0.3rem;
  margin-bottom: 8px;
	background-color:#FFFFFF;
	border-radius: 6px;
	position: relative;
	color:#4e5458;
}
#popup .title:before{
	content: "";
	position: absolute;
	top:0.13rem;
	left:0.2rem;
	width: 3px;
	height:0.18rem;
	border-radius: 10px;
	background:-webkit-linear-gradient(to bottom, #8f32ff 0%, #6a81fe 100%); 
	background:linear-gradient(to bottom, #8f32ff 0%, #6a81fe 100%);
}
#popup .arrow {
  display: none;
  position: absolute;
  top: 0.36rem;
  width: 0;
  height: 0;
  border-width: 0.14rem;
  border-style: solid;
}
#popup .arrow-right {
  right: -0.29rem;
  border-color: transparent transparent transparent #d6d6d6;
}
#popup.popup-right .arrow-right {
  display: block;
}
#popup .arrow-right:after {
  right: -0.13rem;
  border-color: transparent transparent transparent #f4f6f7;
}
#popup .date,
#popup .lunar {
  padding: 0 0.15rem;
  line-height: 0.2rem;
}
#popup .closePop{
	position: absolute;
	right:0.1rem;
	top:0.07rem;
	font-size:0.2rem;
	cursor: pointer;
}
/*滚动条样式*/
#renderMonth .day::-webkit-scrollbar,
.sidebarR .newsBox::-webkit-scrollbar{
	/*滚动条整体样式*/
	width: 0;
	/*高宽分别对应横竖滚动条的尺寸*/
}

#renderMonth .day::-webkit-scrollbar-thumb,
.sidebarR .newsBox::-webkit-scrollbar {
	/*滚动条里面小方块*/
	border-radius: 5px;
	background-color: #935032;
	
}

#renderMonth .day::-webkit-scrollbar-track,
.sidebarR .newsBox::-webkit-scrollbar {
	/*滚动条里面轨道*/
	border-radius: 5px;
	background-color: #e8b169;
}